<!DOCTYPE html>
<html class="loading" lang="zh">
<head>
    <meta charset="UTF-8">
    <title>技研中心 - Demo</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="css/Loading.css">
    <link rel="stylesheet" href="lib/css/bootstrap.css">
    <link rel="stylesheet" href="lib/css/bootstrap-theme.css">
    <link rel="stylesheet" href="lib/slick/slick.css">
    <link rel="stylesheet" href="lib/slick/slick-theme.css">
    <link rel="stylesheet" href="css/require.css">
    <link rel="stylesheet" href="css/index.css">

</head>
    <body class="loading">
    <div class="Loading-Box" id="loading">
        <div id="loading-center">
            <div id="loading-center-absolute">
                <div class="object" id="object_one"></div>
                <div class="object" id="object_two"></div>
                <div class="object" id="object_three"></div>
                <div class="object" id="object_four"></div>
                <div class="object" id="object_five"></div>
                <div class="object" id="object_six"></div>
                <div class="object" id="object_seven"></div>
                <div class="object" id="object_eight"></div>
                <div class="object" id="object_big"></div>
            </div>
        </div>
    </div>
    <nav class="navbar navbar-fixed-top nav-trc">
        <div class="container-fluid">
            <!-- 品牌和调整按钮被分组 便于移动端显示 -->
            <div class="navbar-header">
                <a href="index.html" class="nav-logo"><img src="img/logo.png" alt="logo"></a>
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>

            <!-- 收集导航链接、表单和其他内容以进行切换 -->
            <!--导航条左侧-->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <!--导航条右侧-->
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">技研概况</a><div class="down"></div></li>
                    <li><a href="#">技研要闻</a><div class="down"></div></li>
                    <li><a href="#">技研群组</a><div class="down"></div></li>
                    <li><a href="#">技术研究</a><div class="down"></div></li>
                    <li><a href="#">联系技研</a><div class="down"></div></li>
                    <li id="User-head"><a href="#"><img src="img/header.jpg" alt="" class="User-HeadPic">Admin<span class="badge User-MsgNum">99+</span></a><div class="down"></div></li>
                </ul>
            </div><!-- /.navbar-collapse -->
        </div><!-- /.container-fluid -->
    </nav>
    <div class="banner">
        <ul class="carousel">
            <li><a href="#" class="carousel-item img1"></a></li>
            <li><a href="#" class="carousel-item img2"></a></li>
            <li><a href="#" class="carousel-item img3"></a></li>
        </ul>
    </div>
    <div class="Content-news container-fluid">
        <div class="nbg"></div>
        <div class="container">
            <div class="row">
                <div class="col-md-8 News-image">
                    <h3><b></b>大新闻<b></b></h3>
                    <ul class="clearfix News-image-carousel">
                        <li><a href="">
                            <img src="img/news/image/1.jpg" alt="">
                            <p class="News-image-name">大新闻1 <span class="News-image-date">N天前</span></p>
                            <p class="News-image-content">苹果、英特尔就专利实践对软银子公司发起反垄断诉讼</p>
                        </a></li>
                        <li><a href="">
                            <img src="img/news/image/1.jpg" alt="">
                            <p class="News-image-name">大新闻2<span class="News-image-date">N天前</span></p>
                            <p class="News-image-content">苹果、英特尔就专利实践对软银子公司发起反垄断诉讼</p>
                        </a></li>
                        <li><a href="">
                            <img src="img/news/image/1.jpg" alt="">
                            <p class="News-image-name">大新闻3<span class="News-image-date">N天前</span></p>
                            <p class="News-image-content">苹果、英特尔就专利实践对软银子公司发起反垄断诉讼</p>
                        </a></li>
                    </ul>
                </div>
                <div class="col-md-3 News-notice">
                    <h3><b></b>技研通知<b></b></h3>
                    <ul>
                        <li><a href="#">
                            <p class="News-notice-name">技研中心通知条目1
                                <span class="News-notice-date">19-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-notice-name">技研中心通知条目2
                                <span class="News-notice-date">19-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-notice-name">技研中心通知条目3
                                <span class="News-notice-date">19-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-notice-name">技研中心通知条目4
                                <span class="News-notice-date">19-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-notice-name">技研中心通知条目5
                                <span class="News-notice-date">19-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-notice-name">技研中心通知条目6
                                <span class="News-notice-date">19-12-12</span>
                            </p>
                        </a></li>
                    </ul>
                    <a href="#" class="News-all">查看更多</a>
                </div>
                <div class="col-md-5 News-history">
                    <h3><b></b>历史新闻<b></b></h3>
                    <ul>
                        <li><a href="#">
                            <p class="News-history-name">历史新闻条目1
                                <span class="News-history-date">2019-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-history-name">历史新闻条目2
                                <span class="News-history-date">2019-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-history-name">历史新闻条目3
                                <span class="News-history-date">2019-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-history-name">历史新闻条目4
                                <span class="News-history-date">2019-12-12</span>
                            </p>
                        </a></li>
                        <li><a href="#">
                            <p class="News-history-name">历史新闻条目5
                                <span class="News-history-date">2019-12-12</span>
                            </p>
                        </a></li>
                    </ul>
                    <a href="" class="News-all">查看更多</a>
                </div>
                <div class="col-md-6 News-record">
                    <h3><b></b>技研纪事<b></b></h3>
                    <ul class="News-record-carousel">
                        <li><a href="">
                            <div class="News-record-list">
                                <p class="News-record-name">技研纪实条目1</p>
                                <p class="News-record-author">编辑：Admin &nbsp&nbsp 编辑于2019-12-12</p>
                                <p class="News-record-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
                                    do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
                                    aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                                    pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
                                    deserunt mollit anim id est laborum.</p>
                            </div>
                            <img src="img/news/image/1.jpg" alt="">
                        </a></li>
                        <li><a href="">
                            <div class="News-record-list">
                                <p class="News-record-name">技研纪实条目2</p>
                                <p class="News-record-author">编辑：Admin &nbsp&nbsp 编辑于2019-12-12</p>
                                <p class="News-record-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
                                    do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
                                    aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                                    pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
                                    deserunt mollit anim id est laborum.</p>
                            </div>
                            <img src="img/news/image/1.jpg" alt="">
                        </a></li>
                        <li><a href="">
                            <div class="News-record-list">
                                <p class="News-record-name">技研纪实条目3</p>
                                <p class="News-record-author">编辑：Admin &nbsp&nbsp 编辑于2019-12-12</p>
                                <p class="News-record-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
                                    do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
                                    aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                                    pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
                                    deserunt mollit anim id est laborum.</p>
                            </div>
                            <img src="img/news/image/1.jpg" alt="">
                        </a></li>
                        <li><a href="">
                            <div class="News-record-list">
                                <p class="News-record-name">技研纪实条目4</p>
                                <p class="News-record-author">编辑：Admin &nbsp&nbsp 编辑于2019-12-12</p>
                                <p class="News-record-content">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
                                    do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis
                                    aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
                                    pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
                                    deserunt mollit anim id est laborum.</p>
                            </div>
                            <img src="img/news/image/1.jpg" alt="">
                        </a></li>
                    </ul>
                    <div class="space"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="Content-force container">
        <div class="row">
            <div class="col-md-12 clearfix">
                <div class="Content-force-title">
                    <a href=""><span>技研力量</span></a>
                </div>
                <div class="Content-force-carousel">
                    <ul class="Carousel-left">
                        <li><a href=""><img src="img/banner-fixed/1.jpg" alt="">
                            <div class="Carousel-left-content">
                                <div class="Carousel-left-title">测试标题1</div>
                                <div class="Carousel-left-text">
                                    <p class="Carousel-left-name">复合轮播图1</p>
                                    <p>测试文本区域1；测试文本区域1</p>
                                </div>
                            </div>
                        </a></li>
                        <li><a href=""><img src="img/banner-fixed/3.jpg" alt="">
                            <div class="Carousel-left-content">
                                <div class="Carousel-left-title">测试标题1</div>
                                <div class="Carousel-left-text">
                                    <p class="Carousel-left-name">复合轮播图1</p>
                                    <p>测试文本区域1；测试文本区域1</p>
                                </div>
                            </div>
                        </a></li>
                        <li><a href=""><img src="img/banner-fixed/4.jpg" alt="">
                            <div class="Carousel-left-content">
                                <div class="Carousel-left-title">测试标题1</div>
                                <div class="Carousel-left-text">
                                    <p class="Carousel-left-name">复合轮播图1</p>
                                    <p>测试文本区域1；测试文本区域1</p>
                                </div>
                            </div>
                        </a></li>
                    </ul>
                    <ul class="Carousel-right">
                        <li><a href=""><img src="img/banner-fixed/3.jpg" alt="">
                            <div class="Carousel-right-content">
                                <div class="Carousel-right-title">测试标题 小1</div>
                                <div class="Carousel-right-text">
                                    <p class="Carousel-right-name">测试文本区域 小1；</p>
                                    <p>测试文本区域 小1；</p>
                                </div>
                            </div>
                        </a></li>
                        <li><a href=""><img src="img/banner-fixed/4.jpg" alt="">
                            <div class="Carousel-right-content">
                                <div class="Carousel-right-title">测试标题 小1</div>
                                <div class="Carousel-right-text">
                                    <p class="Carousel-right-name">测试文本区域 小1；</p>
                                    <p>测试文本区域 小1；</p>
                                </div>
                            </div>
                        </a></li>
                        <li><a href=""><img src="img/banner-fixed/1.jpg" alt="">
                            <div class="Carousel-right-content">
                                <div class="Carousel-right-title">测试标题 小1</div>
                                <div class="Carousel-right-text">
                                    <p class="Carousel-right-name">测试文本区域 小1；</p>
                                    <p>测试文本区域 小1；</p>
                                </div>
                            </div>
                        </a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="Content-data container">
        <div class="Content-data-title">
            <b></b><span>技研数据</span><b></b>
        </div>
        <ul class="Content-data-carousel">
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">123,456</p>
                    <p class="Data-carousel-title">技研数据1</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">789,987</p>
                    <p class="Data-carousel-title">技研数据2</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">654,321</p>
                    <p class="Data-carousel-title">技研数据3</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">888,699</p>
                    <p class="Data-carousel-title">技研数据4</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">152,123</p>
                    <p class="Data-carousel-title">技研数据5</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">152,123</p>
                    <p class="Data-carousel-title">技研数据6</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">152,123</p>
                    <p class="Data-carousel-title">技研数据7</p>
                </div>
            </li>
            <li>
                <div class="Data-carousel-content">
                    <span class="glyphicon glyphicon-briefcase"></span>
                    <p class="Data-carousel-text">152,123</p>
                    <p class="Data-carousel-title">技研数据8</p>
                </div>
            </li>
        </ul>
    </div>
    <div class="Content-teacher container-fluid">
        <div class="container">
            <div class="Content-teacher-title">
                <b></b><span>技研导师</span><b></b>
            </div>
            <div class="Content-tech-carousel">
                <ul class="Tech-main-carousel">
                    <li>
                        <div class="Tech-main-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-main-info">
                                <p class="Tech-carousel-main-info-name">NAME0</p>
                                <p class="Tech-carousel-main-info-job">JOB0</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="Tech-main-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-main-info">
                                <p class="Tech-carousel-main-info-name">NAME1</p>
                                <p class="Tech-carousel-main-info-job">JOB1</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="Tech-main-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-main-info">
                                <p class="Tech-carousel-main-info-name">NAME2</p>
                                <p class="Tech-carousel-main-info-job">JOB2</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="Tech-main-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-main-info">
                                <p class="Tech-carousel-main-info-name">NAME3</p>
                                <p class="Tech-carousel-main-info-job">JOB3</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                                <p class="Tech-carousel-main-info-text">TEXT</p>
                            </div>
                        </div>
                    </li>
                </ul>
                <ul class="Tech-small-carousel">
                    <li>
                        <div class="Tech-small-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-small-info">
                                <p class="Tech-carousel-small-info-name">NAME0</p>
                                <p class="Tech-carousel-small-info-job">JOB0</p>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="Tech-small-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-small-info">
                                <p class="Tech-carousel-small-info-name">NAME1</p>
                                <p class="Tech-carousel-small-info-job">JOB1</p>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="Tech-small-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-small-info">
                                <p class="Tech-carousel-small-info-name">NAME2</p>
                                <p class="Tech-carousel-small-info-job">JOB2</p>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="Tech-small-carousel-area">
                            <img src="img/teacher/1.png" alt="">
                            <div class="Tech-carousel-small-info">
                                <p class="Tech-carousel-small-info-name">NAME3</p>
                                <p class="Tech-carousel-small-info-job">JOB3</p>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>

    </div>
    <div class="Content-contact container-fluid">
        <div class="container">
            <div class="Content-contact-title">
                <b></b><span>联系我们</span><b></b>
                <p>您的意见是我们不断改进的动力</p>
            </div>
            <div class="row">
                <div class="col-md-6 contact-social">
                    <p>社交媒体</p>
                    <hr>
                    <div class="contact-social-list">
                        <ul>
                            <li class="wechat">
                                <div class="item"><img src="img/icon/wechat.png" alt=""></div>
                                <div class="text">微信公众号：<img src="img/TRCQR-white.png" alt=""></div>
                            </li>
                            <li class="email">
                                <div class="item"><img src="img/icon/email.png" alt=""></div>
                                <div class="text">电邮：noreply@aeroz.cn</div>
                            </li>
                            <li class="telephone">
                                <div class="item"><img src="img/icon/Telephone.png" alt=""></div>
                                <div class="text">电联：020-6666666</div>
                            </li>
                            <li class="local">
                                <div class="item"><img src="img/icon/local.png" alt=""></div>
                                <div class="text">
                                    清远校区砺能4楼办公室
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="col-md-6 contact-form">
                    <p>联系表单</p>
                    <hr>
                    <div class="form row clearfix">
                        <div class="form-design col-xs-5 name">
                            <input type="text" id="Contact-basic-name" name="name" autocomplete="off" required>
                            <label for="Contact-basic-name">
                                <span class="placeholder">你的名字</span>
                            </label>
                        </div>
                        <div class="form-design col-xs-6 feedback">
                            <input type="text" id="Contact-basic-Addr" name="feedback" autocomplete="off" required>
                            <label for="Contact-basic-Addr">
                                <span class="placeholder">联系方式</span>
                            </label>
                        </div>
                        <div class="text-design">
                            <textarea id="Contact-basic-msg" name="msg" cols="30" rows="5" required></textarea>
                            <label for="Contact-basic-msg">
                                <span class="placeholder">留言讯息</span>
                            </label>
                        </div>
                        <input type="submit" class="submit-design">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="Content-link container">
        <div class="Content-link-title">
            <b></b><span>常用链接</span><b></b>
        </div>
        <div class="row Content-link-list">
            <div class="col-xs-6 col-sm-3">
                <a href=""><img src="img/link/lnsy.jpg" alt=""></a>
            </div>
            <div class="col-xs-6 col-sm-3">
                <a href=""><img src="img/link/lnsy.jpg" alt=""></a>
            </div>
            <div class="col-xs-6 col-sm-3">
                <a href=""><img src="img/link/lnsy.jpg" alt=""></a>
            </div>
            <div class="col-xs-6 col-sm-3">
                <a href=""><img src="img/link/lnsy.jpg" alt=""></a>
            </div>
        </div>
    </div>
    <footer>
        <div class="container">
            <div class="row">
                <div class="col-md-6 footer-logo">
                    <img src="img/logo.png" alt="">
                </div>
                <div class="col-md-6">
                    <div class="footer-right">
                        <img src="img/TRCQR-white.png" alt="">
                        <div class="footer-right-msg">
                            <p><span class="glyphicon glyphicon-earphone"></span>Tel: 020-xxxxx</p>
                            <p><span class="glyphicon glyphicon-map-marker"></span>Addr: 广东岭南职业技术学院</p>
                            <p><span class="glyphicon glyphicon-envelope"></span>E-Mail: noreply@aeroz.cn</p>
                        </div>
                    </div>
                </div>
            </div>
            <hr>
            <div class="footer-web-msg-left">Copyright 2019 By Curitis_TRC</div>
            <div class="footer-web-msg-right">粤ICP备190XXXXX号-1</div>
        </div>

    </footer>




    <script src="lib/jquery-3.4.1.js"></script>
    <script src="lib/js/bootstrap.js"></script>
    <script src="lib/slick/slick.js"></script>
    <script src="js/nav.js"></script>
    <script src="js/index/banner.js"></script>
    <script src="js/index/news.js"></script>
    <script src="js/index/force.js"></script>
    <script src="js/index/data.js"></script>
    <script src="js/index/teacher.js"></script>
</body>
</html>